.container {
	height: 100vh;
	display: flex;
	flex-direction: column;

	.header {
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 0 15px;
		border-bottom: 1px solid #ddd;

		.logo {
			font-size: 20px;
		}

		.layout {
			display: flex;
			flex-direction: row;
			align-items: center;
		}
	}

	.context {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;

		.search_box {
			flex: 1;
			display: flex;
			flex-direction: column;
			margin: 0 auto;
			max-width: 800px;
			margin: 0 15px;

			.search_result {
				flex: 1;

				.item {
					background: #9991;
					border-radius: 10px;
					padding: 15px;
					margin-top: 35px;

					.problem {
						font-size: 18px;
						margin: 0;
						margin-bottom: 5px;
						font-weight: 200;
					}

					.answer {
						font-size: 16px;
						color: #000;
					}
				}
			}
		}
	}

	.footer {
		display: flex;
		justify-content: center;
		padding: 15px 0;
		background: #0001;

		.footer_row {
			display: flex;
			flex-direction: row;

			@media screen and (max-width: 800px) {
				.footer_left {
					padding-left: 15px;
				}

				.footer_right {
					visibility: hidden;
					display: none;
				}
			}
		}
	}

	.layout {
		margin: 0 auto;
		max-width: 1200px;
		width: 100%;
	}

	.control {
		flex: 1;
		flex-direction: column;
		justify-content: unset;
		align-items: unset;

		.content {
			display: flex;
			flex-direction: row;
			padding: 45px 0;
			height: 100%;

			.rs-nav-item-active {
				background: #e5e5ea;
				font-weight: bold;
			}
			.content_app {
				flex: 1;
				margin-left: 50px;
			}
		}

		.nav_divider {
			margin: 0;
		}

		.rs-navbar {
			background: none;
		}
	}
}
